<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      :root {
        --taskContainer2-height: 10px;
      }
      #taskContainer2 {
        height: var(--taskContainer2-height);
        background-color: black;
      }
    </style>
  </head>
  <body>
    <div id="taskContainer2"></div>
    <button onclick="test(123)"></button>
  </body>
  <script>
    let controlCss = {
      taskContainer2: {
        height: 10,
      },
    };
    function myTypeOf(obj) {
      //判断数据类型
      return Object.prototype.toString.call(obj).slice(8, -1);
    }
    function deepProxySet(obj, cb = function () {}) {
      let condition = ["Function", "Object", "Array"].includes(myTypeOf(obj));
      let handler = {
        set(t, p, n, s) {
          t[p] = condition ? deepProxySet(n, cb) : n;
          cb(t, p, n, s);
          return true;
        },
      };

      if (!condition) return obj;
      else {
        for (let key in obj) {
          if (condition) obj[key] = deepProxySet(obj[key], cb);
        }
      }

      return new Proxy(obj, handler);
    }
    let a = deepProxySet({}, function (t, p, n, s) {
      console.log({ t, p, n, s });
    });
    a.aa = { a: { aaa: 123 } };
    function test(params) {
      a.aa.a.aaa = 2;
      //   controlCss.taskContainer2.height = params;
    }
  </script>
</html>
